﻿@model Xms.Web.Customize.Models.WebResourceModel
@{
    Layout = null;
}
@{
    Xms.Web.Models.DialogModel dialogModel = ViewData["DialogModel"] as Xms.Web.Models.DialogModel;
}
<!-- （Modal） -->
<div class="modal fade" id="webResourceModal" tabindex="-1" role="dialog"
     aria-labelledby="webResourceModalLabel" aria-hidden="true">
    <div class="modal-dialog" style="width:650px;">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-hidden="true">
                    ×
                </button>
                <h4 class="modal-title" id="webResourceModalLabel">
                    <span class="glyphicon glyphicon-th"></span> Web资源
                </h4>
            </div>
            <div class="modal-body">

                <div class="row">
                    @using (Html.BeginRouteForm("Customize", FormMethod.Get, new { @id = "searchForm", @class = "form-horizontal", @role = "form" }))
                    {
                        @Html.AntiForgeryToken()
                        @Html.Hidden("CallBack", dialogModel.CallBack)
                        <div class="form-group col-sm-12" style="height:30px;margin-bottom:0px;">

                            <label class="col-sm-2 control-label" for="clientip">@app.T["name"]</label>
                            <div class="col-sm-10">
                                <div class="input-group">
                                    @Html.TextBoxFor(x => x.Name, new { @class = "form-control input-sm" })
                                    <span class="input-group-btn">
                                        <button class="btn btn-default btn-sm datagrid-form-search" type="submit">
                                            <span class="glyphicon glyphicon-search"></span> @app.T["search"]
                                        </button>
                                    </span>
                                </div>
                            </div>
                        </div>
                    }
                </div>
                <div class="datagrid-selecterview mt-2" id="datagridselecterview"></div>
                <div class="table-responsive" id="gridview">
                    <table class="table table-striped table-hover table-condensed datatable" id="datatable" data-ajax="true" data-ajaxcontainer="gridview" data-ajaxcallback="ajaxgrid_reset()" data-sortby="@Model.SortBy.ToLower()" data-sortdirection="@Model.SortDirection" data-singlemode="@dialogModel.SingleMode">
                    </table>

                    <link href="~/content/js/jquery-ui-1.10.3/themes/base/jquery.ui.all.css?v=@app.PlatformSettings.VersionNumber" rel="stylesheet">
                    <link href="~/content/js/grid/pqgrid.dev.css?v=@app.PlatformSettings.VersionNumber" rel="stylesheet">
                    <link id="themeLink" href="~/content/css/theme/@(app.Theme).css" rel="stylesheet" />
                    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.button.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.mouse.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.autocomplete.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.draggable.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.resizable.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/jquery-ui-1.10.3/ui/jquery.ui.tooltip.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="~/content/js/fetch.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="~/content/js/common/filters.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/grid/pqgrid.dev.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/grid/localize/pq-localize-zh.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/cdatagrid.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/jquery.bootpag.min.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/jquery.form.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script src="/content/js/xms.js?v=@app.PlatformSettings.VersionNumber"></script>
                    <script>
                        var WebResourcesModel = {
                            dialogid: '#webResourceModal',
                            dialog: $('#webResourceModal'),
                            callback : @dialogModel.CallBack,
                            datatable: $("#webResourceModal .datatable"),
                            gridview: $("#webResourceModal #gridview"),
                            searchform: $('#webResourceModal #searchForm'),
                            pagesection: $('#webResourceModal #page-selection'),
                            pageUrl : '@app.Url',
                            callback : @dialogModel.CallBack,
                            inputid : '@dialogModel.InputId',
                            solutionid:'@Model.SolutionId',
                            ajaxgrid_reset : function () {
                                WebResourcesModel.pag_init();
                                Xms.Web.DataTable(WebResourcesModel.datatable);
                            },
                            pag_init: function () {
                                WebResourcesModel.pagesection.bootpag({
                                    total: WebResourcesModel.pagesection.attr('data-total')
                                    , maxVisible: 5
                                    , page: WebResourcesModel.pagesection.attr('data-page')
                                    , leaps: false
                                    , prev: '&lsaquo;'
                                    , next: '&rsaquo;'
                                    , firstLastUse: true
                                    , first: '&laquo;'
                                    , last: '&raquo;'
                                }).on("page", function (event, /* page number here */ num) {
                                    event.preventDefault();
                                    var url = $.setUrlParam(WebResourcesModel.pageUrl, 'page', num);
                                    WebResourcesModel.gridview.ajaxLoad(url, WebResourcesModel.gridview.prop('id'), function (response) {
                                        WebResourcesModel.ajaxgrid_reset();
                                    });
                                    return false;
                                });
                            },
                            dialog_return: function (obj) {
                                if (obj) {
                                    var trindex = $(obj).parents('tr:first').index();
                                    var res = Xms.DataGridCtrl.getRowData('datagridselecterview', trindex-1);

                                } else {
                                    var res = Xms.DataGridCtrl.getSelectedData('datagridselecterview');
                                }
                                console.log(res);
                                var result = new Array();
                                if (!$.isArray(res)) {
                                    res = [res];
                                }
                                if (res && res.length > 0) {
                                    $.each(res, function (i, n) {
                                        var temp = {}
                                        $.extend(temp, n);
                                        temp.id = n.webresourceid;
                                        result.push(temp);
                                    });
                                }

                                var dialog = $(WebResourcesModel.dialogid);
                                if (dialog.data().OpenDialogCallback) {
                                    dialog.data().OpenDialogCallback(result, WebResourcesModel.inputid,WebResourcesModel)
                                } else {
                                    WebResourcesModel.callback && WebResourcesModel.callback(result,WebResourcesModel.inputid);
                                }
                                WebResourcesModel.dialog.modal('hide');
                            }
                            , selectedrow: function (id) {

                            }
                            ,CreateRecord: function(){
                                Xms.Web.OpenWindow(ORG_SERVERURL +'/customize/webresource/createwebresource?solutionid=' + (WebResourcesModel.solutionid || $.getUrlParam('solutionid')));
                            }
                        };

                        $(function () {
                            //WebResourcesModel.ajaxgrid_reset();
                           // WebResourcesModel.searchform.ajaxSearch('#'+WebResourcesModel.gridview.prop('id'), WebResourcesModel.ajaxgrid_reset);
                           // WebResourcesModel.datatable.ajaxTable();
                            WebResourcesModel.dialog.modal({
                                backdrop:'static'
                            });
                            $("#webResourceModal .datatable").on('hidden.bs.modal', function () {
                                Xms.Web.CloseDialog(WebResourcesModel.dialogid);
                            });
                            console.log('webResourceModal')
                            $("#webResourceModal").find('button[name=createBtn]').off('click').on('click', null, function (e) {
                                e.preventDefault();
                                WebResourcesModel.CreateRecord();
                            });
                        });
                    </script>
                </div>
            </div>
            <div class="modal-footer">
                <div class="pull-left">
                    <button type="button" class="btn btn-link" name="createBtn">
                        <span class="glyphicon glyphicon-plus-sign"></span> 新建
                    </button>
                </div>
                <button type="button" class="btn btn-default"
                        data-dismiss="modal">
                    <span class="glyphicon glyphicon-remove"></span> 关闭
                </button>
                <button type="button" class="btn btn-primary" onclick="WebResourcesModel.dialog_return()">
                    <span class="glyphicon glyphicon-ok"></span> 确定
                </button>
            </div>
            <script>
                var websourcetypes = [{ label: '脚本', value: 'Script' }, { label: '样式', value: 'Css' }, { label: '网页', value: 'Html' }, { label: '图片', value: 'Picture' }]
                $(function () {

                            var theaders = {
                                'typename':'@app.T["typename"]',
                                'name': '@app.T["name"]',
                                'description': '@app.T["description"]',
                                'createdon': '创建时间',
                                'operation':'@app.T["operation"]'
                            }
                            //列数据配置数据
                            var columnConfigs = [
                            //从新配置复选框列的渲染方式，
                                {
                                    title: "", dataIndx: "recordid", maxWidth: 48, minWidth: 48, align: "center", resizable: false,
                                    type: 'checkBoxSelection', cls: 'ui-state-default', sortable: false, editable: false,
                                    render: function (ui) {
                                        //  console.log(ui)
                                        return '<input type="checkbox" value="' + ui.rowData.webresourceid + '" name="recordid" class="">'
                                    },
                                    cb: { all: true, header: true }
                                },
                                {
                                    title: "", dataIndx: "name", maxWidth: 30, minWidth: 30, align: "center", resizable: false,
                                        cls: 'ui-state-default', sortable: false, editable: false,
                                    hidden:true,
                                    render: function (ui) {
                                        //  console.log(ui)
                                        return '<input type="hidden" value="' + ui.rowData.webresourceid + '" name="componenttypename" class="">'
                                    },
                                    cb: { all: true, header: true }
                                },

                                { "dataIndx": "name", "title": theaders.name, editable: false, "dataType": "string", "width": 150, "isprimaryfield": false, "attributetypename": "string" },
                                { "dataIndx": "description", "title": theaders.description, "dataType": "string", editable: false, "width": 150, "isprimaryfield": false, "attributetypename": "string" },
                                {
                                    title: "操作", editable: false, minWidth: 120,width:120, notHeaderFilter: true, editable: false, sortable: false, render: function (ui) {
                                        var datas = ui.rowData;
                                        var dataIndx = ui.dataIndx;
                                        var column = ui.column;
                                        var recordid = datas[dataIndx];
                                        var html = ''
                                        html=  '<a class="btn btn-link btn-xs row-item-dblclick" onclick="WebResourcesModel.dialog_return(this);"><span class="glyphicon glyphicon-ok text-success"></span></a>'
                                        return html
                                    }
                                }
                            ];
                            var url = ORG_SERVERURL + '/customize/webresource/index?LoadData=true&';
                            var $form = $('#searchForm');
                            var roles_filters = new XmsFilter();
                            var datagridconfig = {
                                scrollModel: { autoFit: true },
                                baseUrl: url,
                                columnConfigs: columnConfigs,//字段配置信息
                                context: $('#gridview'),//底部操作按钮方法触发
                                filters: roles_filters,//post提交时过滤条件
                                searchForm: $form//GET提交时查询的数据
                                , height: 400
                                , rowDblClick: function (even, ui) {
                                    console.log(even, ui);
                                    ui.$tr.find('.row-item-dblclick').trigger('click');
                                }
                    };

                    setTimeout(function () {
                        $('.datagrid-selecterview').xmsDataTable(datagridconfig);

                    },300)

                });
            </script>
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div><!-- /.modal -->